<div class="root">
    <div class="header">
        <image resize="stretch" class="header-bg" :src="orderTabBg"></image>

        <div class="tab">
            <text :class="['tab-item',typeId == tab.typeId ? 'tab-item-active' : 'tab-item-common',$index == tabList.length-1 ? 'tab-item-last' : '']" v-for="(tab,$index) in tabList" :key="tab.typeId"  @click="getSelectList(tab)">{{tab.name}}</text>
        </div>
    </div>

    <list ref="list" class="list" loadmoreoffset="15" offset-accuracy="30" @loadmore="fetchMore" @scroll="onScroll">
        <cell ref="cell-first" class="cell-first"></cell>
        <cell class="list-item" append="tree" v-for="(order,index) in orderList" :ref="'cell_' + index" :key="order.transactionid">
            <div class="list-item-content">
                <order-title :sid="order.sid" :shopType="order.shoptype" :sname="order.sname" :hasStatus=true :status="order.status"></order-title>

                <order-content :order="order"></order-content>

                <order-item-des v-if="typeId != 6" :order="order"></order-item-des>
            </div>

            <div class="order-btn">
                <order-btn v-if="typeId != 6" :order="order" @delOrder="delOrder" @updateOrder="updateOrder"></order-btn>

                <div v-else class="refund-btn">
                    <btn-item borderColor="#e31336" color="#e31336" @btnClick="goToRefundDetail(order)">查看详情</btn-item>
                </div>
            </div>
        </cell>

        <!--加载提示-->
        <loading-more-tip v-if="!listCompleted && orderList.length" :loading="loading"></loading-more-tip>

        <cell v-if="listCompleted && orderList.length">
            <loaded-over-tip :tip="'没有更多订单了 ~'"></loaded-over-tip>
        </cell>

        <cell class="empty-cell" v-if="listLoaded && !orderList.length">
            <image class="list-null-icon" resize="stretch" :src="listNullIcon"></image>
            <text class="list-null-txt font-msyhl">您还没有相关的订单</text>
        </cell>
    </list>

    <!--一键置顶-->
    <go-top :showGoTop="showGoTop" :refEl="refEl"></go-top>
</div>